<template>
  <van-nav-bar title="提交成功" left-arrow @click-left="onClickLeft" />
  <div class="ok-con">
    <div class="ok-icon">
      <van-icon name="completed-o" color="#09b674" size="100" />
    </div>
    <div class="ok-two">
      <div>订单已提交成功！</div>
      <div>支付金额：<span>￥108</span></div>
    </div>
  </div>
  <div
    class="but"
    style="
      width: 80%;
      margin: 0 auto;
      display: flex;
      justify-content: space-around;
    "
  >
    <van-button type="default">查看订单</van-button>
    <van-button to="/" type="default">返回首页</van-button>
  </div>
</template>
<script setup>
const onClickLeft = () => history.back();
</script>
<style>
.ok-con {
  text-align: center;
}
.ok-con span {
  color: #fc6217;
}
.ok-icon {
  margin: 30px 0;
}
.ok-two div {
  font-size: 20px;
  padding: 3px 0;
}
.but {
  padding: 80px 0;
}
</style>
